import React from 'react';
import {AtCountdown} from "taro-ui";
import {View, Image, Text, Navigator} from '@tarojs/components'
import {Good} from '../../../utils/server.interface'
import './big-goods-box.scss'

const BigGoodsBox: React.FC<{ data: Good[]; isSeller: boolean }> = (props) => {
  return (
    <View className='bigGoodsBoxLian'>
      {props.data.map(item => <Navigator key={item.id} className='good-item-lian'
        url={'/common/limited/localdetail?locationId=' + item.locationId + '&productId=' + item.id}
        hoverClass='none'
      >
        <View className='img-box'>
          <Image lazyLoad src={item.faceImg + '?x-oss-process=image/resize,w_270'} mode='aspectFill'
            className='img'
          />
          {item.type === 1 && <View className='local-tips local-tips1'>抢购中</View>}
          {item.type === 3 && <View>
            <View className='local-tips local-tips2 countdown'>
              <AtCountdown
                format={{day: '天', hours: '时', minutes: '分', seconds: '秒'}}
                seconds={item.endTime}
              />
            </View>
            <View className='local-tips local-tips2'>即将下架</View>
          </View>}
        </View>
        <View className='right'>
          <View className='title'>{item.title}</View>
          <View className='desc'>{item.shareText}</View>
          <View className='data'>
            <View className='lt'>
              <View className='price local-item'>¥{item.salePrice}</View>
              <View className='menshi local-item'>市场价¥{item.originPrice}</View>
              {/*<View className='xioal local-item'>销量 {item.channelSaleAmount}</View>*/}
            </View>
            {props.isSeller && <View className='rt'>
              <View>
                <Image lazyLoad src='https://resource.ivcheng.com/resources/weapp/images/local-icon2.png'
                  mode='widthFix'
                  className='data-img'
                />
              </View>
              <View className='yongj'>
                佣金 <Text className='r-icon'>¥</Text> {item.sellerProfit}
              </View>
            </View>}
          </View>
        </View>
      </Navigator>)}
    </View>
  )
}
BigGoodsBox.defaultProps = {
  data: []
}

export default BigGoodsBox
